<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>后台管理</title>



<link href="static/css/bass.css" rel="stylesheet" type="text/css">
<script src="static/js/jquery.js" type="text/javascript"></script>


</head>

<body>
<div class="pageHeader">
	<h3><i class="fa fa-table"></i> 积分商品</h3>
    <div class="fr">
    	<a href="#" class="btn">返回</a>
    </div>
</div>




<form class="form-validate">
<div class="fromBody">

	<table width="100%" class="tableAAA">
    	<tr>
            <th width="110" align="right" valign="top">类型：</th>
            <td>
            	<input type="radio" name="type" value="" id="type1" checked />
            	<label for="type1">普通文章</label> 
                
                <input type="radio" name="type" value="" id="type2" />
                <label for="type2"> 跳转地址 </label>
                
                <input type="text" name="jumpurl" value="" />(说明文字)
            </td>
        </tr>
        <tr>
            <th align="right" valign="top">分类：</th>
            <td>
				<select name="tid">
                	<option value="1" selected>默认：选项1</option>
                    <option value="2">选项2</option>
                </select> 
            </td>
        </tr>
        
  		<tr>
            <th align="right" valign="top">标题 验证：</th>
            <td><input type="text" name="title" value="" class="input-large"  
            
            data-rule-required="true"
            data-msg-required="必须，自定义提示"
            
            data-rule-minlength="6"
            data-msg-minlength="XXX最小6个"
            
            
             /></td>
        </tr>
        <tr>
            <th align="right" valign="top">标题：</th>
            <td>
<input type="text" name="title"  class="input-mini" value="input-mini" /><br/>
<input type="text" name="title"  class="input-small-z" value="input-small-z" /><br/>
<input type="text" name="title"  class="input-small" value="input-small" /><br/>

<input type="text" name="title"  class="input-medium" value="input-medium" /><br/>

<input type="text" name="title"  class="input-large" value="input-large" /><br/>
<input type="text" name="title"  class="input-xlarge" value="input-xlarge" /><br/>
<input type="text" name="title"  class="input-xxlarge" value="input-xxlarge" /><br/>
            </td>
        </tr>

        
        
        
        
        <tr>
            <th align="right" valign="top">标题2：</th>
            <td><input type="text" name="title2" value="" /> </td>
        </tr>
        <tr>
            <th align="right" valign="top">标题3：</th>
            <td><input type="text" name="title3" value="" /> </td>
        </tr>
        
        <tr>
            <th align="right" valign="top">属性：</th>
            <td>
            	<input type="checkbox" name="display" value="1" id="display" checked />
            	<label for="display"> 显示 </label> &nbsp;&nbsp;&nbsp;&nbsp;
                排序：<input type="text" name="sortid" value="50"  size="5" /> &nbsp;&nbsp;&nbsp;&nbsp;
                浏览量：<input type="text" name="sortid" value="50"  size="5" /> &nbsp;&nbsp;&nbsp;&nbsp;
            </td>
        </tr>
        <tr>
            <th align="right" valign="top">时间插件 (日期)：</th>
            <td><input type="text" name="" value="" id='' WdatePicker="date" />


            </td>
        </tr>
        <tr>
            <th align="right" valign="top">时间插件 (日期时间)：</th>
            <td><input type="text" name="" value="" id='' WdatePicker="datetime"/>
            </td>
        </tr>
        <tr>
            <th align="right" valign="top">时间插件 (时间)：</th>
            <td><input type="text" name=""  class="input-medium" value="" WdatePicker="time"/>
            </td>
        </tr>
        <tr>
            <th align="right" valign="top">作者：</th>
            <td><input type="text" name="writer" value="" /> </td>
        </tr>
        <tr>
            <th align="right" valign="top">来源：</th>
            <td><input type="text" name="source" value="" /> </td>
        </tr>
        <tr>
            <th align="right" valign="top">上传图片(单)：</th>
            <td>
        <div kindeditor="uploadpic" >
        	<img src="" KEimg style="max-width:100px; max-height:100px; " >
            <input type="hidden" name="litpic" value="" KEipt  />
            <input type="button" value="图片上传" KEbtn >
        </div>
            </td>
        </tr>
        <tr>
            <th align="right" valign="top">上传图片(多)：</th>
            <td>
        <div kindeditor="uploadpicmulti" >
            <input type="button" value="上传图集" KEbtn >
            <div KEbox="imgs" class="imgsbox"></div>
        </div>
            </td>
        </tr>
        <tr>
            <th align="right" valign="top">附件上传：</th>
            <td>
        <div kindeditor="uploadfile" >
            <input type="button" value="上传文件" KEbtn >
            <input type="text" name="fileurl" value="666" KEipt/>
            <!--<input type="text" name="filename" value="123" KEfilename/>-->
        </div>
            </td>
        </tr>
        <tr>
            <th align="right" valign="top">拾色器：</th>
            <td>
        <div kindeditor="colorpicker" >
        	<span KEbg  KEbtn style="display:inline-block; vertical-align: middle; width:20px; height:20px; border:2px solid #000;">&nbsp;</span>
            <input type="text" name="color" value="" KEipt/>
            <input type="button" value="选择颜色" KEbtn >
        </div>
            </td>
        </tr>
        <tr>
        	<th align="right" valign="top">富文本编辑器：</th>
        	<td><textarea name="content"  style="width:95%;height:100px;">KindEditor</textarea></td>
        </tr>
        <tr>
        	<th align="right" valign="top">富文本编辑器：</th>
        	<td><textarea name="content"  style="width:95%;height:100px;">KindEditor</textarea></td>
        </tr>
        <tr>
        	<th align="right" valign="top">富文本编辑器：</th>
        	<td><textarea name="content" kindeditor style="width:95%;height:400px;">KindEditor</textarea></td>
        </tr>

        
		<tr>
            <th align="right" valign="top"></th>
      		<td>
            	<input type="hidden" name="" value=""/>
            	<input type="submit" value="提交" class="btn"/>
                
                <a href="?#" class="btn btn-large">btn btn-large</a> 
                <a href="?#" class="btn btn-small">btn btn-small</a> 
                <a href="?#" class="btn btn-mini">btn btn-mini</a> 
                
                <a href="?#" class="btn btn-primary">btn btn-primary</a> 
                <a href="?#" class="btn btn-warning">btn btn-warning</a> 
                <a href="?#" class="btn btn-danger">btn btn-danger</a> 
                <a href="?#" class="btn btn-success">btn btn-success</a> 
                <a href="?#" class="btn btn-info">btn btn-info</a> 
                <a href="?#" class="btn btn-inverse">btn btn-inverse</a> 
                
                btn-mini
                
                
                
            </td>
       </tr>
       
    </table>
   	<div style="height:50px;"></div>
</div>
</form>
<pre>
验证：
http://www.w3cschool.cc/jquery/jquery-plugin-validate.html 
经典用法：在input标签上添加 属性


            data-rule-required="true"
            data-msg-required="必填项，自定义提示"
            
            data-rule-equalTo="#password1"
            data-msg-equalTo="两次密码不一致"
            
            data-rule-minlength="6"
            data-msg-minlength="输入长度最小是 6 的字符串（汉字算一个字符）"
            
            data-rule-maxlength="6"
            data-msg-maxlength="输入长度最多是 6 的字符串（汉字算一个字符）"
            
            data-rule-rangelength="[5,10]"
            data-msg-rangelength="输入长度必须介于 5 和 10 之间的字符串（汉字算一个字符）"
            
            data-rule-range="[5,10]"
            data-msg-range="输入值必须介于 5 和 10 之间"
            
            data-rule-min="5"
            data-msg-min="输入值不能小于 5"
            
            data-rule-min="10"
            data-msg-min="输入值不能大于 10"

           
            data-rule-digits="true"
            data-msg-digits="最小必须输入整数个字符"
            
            
            data-rule-number="true"
            data-msg-number="必须输入合法的数字（负数，小数）"
            
            data-rule-email="true"
            data-msg-email="必须输入正确格式的电子邮件"
            
            data-rule-url="true"
            data-msg-url="必须输入正确格式的网址"
            
            
            


默认校验规则
序号	规则	描述
1	required:true	必须输入的字段。
2	remote:"check.php"	使用 ajax 方法调用 check.php 验证输入值。
3	email:true	必须输入正确格式的电子邮件。
4	url:true	必须输入正确格式的网址。
5	date:true	必须输入正确格式的日期。日期校验 ie6 出错，慎用。
6	dateISO:true	必须输入正确格式的日期（ISO），例如：2009-06-23，1998/01/22。只验证格式，不验证有效性。
7	number:true	必须输入合法的数字（负数，小数）。
8	digits:true	必须输入整数。
9	creditcard:	必须输入合法的信用卡号。
10	equalTo:"#field"	输入值必须和 #field 相同。
11	accept:	输入拥有合法后缀名的字符串（上传文件的后缀）。
12	maxlength:5	输入长度最多是 5 的字符串（汉字算一个字符）。
13	minlength:10	输入长度最小是 10 的字符串（汉字算一个字符）。
14	rangelength:[5,10]	输入长度必须介于 5 和 10 之间的字符串（汉字算一个字符）。
15	range:[5,10]	输入值必须介于 5 和 10 之间。
16	max:5	输入值不能大于 5。
17	min:10	输入值不能小于 10。


</pre>     
        

<!-- 插件 -->
<script src="static/lib/My97DatePicker/WdatePicker.js"></script>

<script src="static/lib/validate/jquery.validate.js"></script>
<script src="static/lib/validate/additional-methods.js"></script>

<link href="static/lib/jbox/Metro/jbox.css" rel="stylesheet"/>
<script src="static/lib/jbox/jquery.jBox.js"></script>

<link rel="stylesheet" href="static/kindeditor/themes/default/default.css" />
<script charset="utf-8" src="static/kindeditor/kindeditor.js"></script>
<script charset="utf-8" src="static/kindeditor/kindeditor-lrxin.js"></script>

<script src="static/js/lrxin-form.js"></script>




</body>
</html>
